import mittEvent from '../utils/mitt';
import { defineComponent } from 'vue';
import SampleComponentBase from '/@/shared/component-base/sample-component-base';
import { RedoOutlined, DownOutlined } from '@ant-design/icons-vue';
import { IPageFilterElementDto } from '/@/shared/service-proxies';
import ComponentMixin from './component-mixin';
import { isArray } from '/@/utils/is';
export default defineComponent({
  data() {
    return {
      // 是否开启高级过滤搜索
      hasAdvancedFilter: false,
    };
  },
  mixins: [SampleComponentBase, ComponentMixin],
  components: { RedoOutlined, DownOutlined },
  props: {
    value: {
      type: Object,
      required: true,
      default: {},
    },
    json: {
      type: Array<IPageFilterElementDto>,
      required: true,
      default: [],
    },
  },
  emits: ['search', 'update:value', 'change'],
  computed: {
    searchForm: {
      get() {
        return this.value;
      },
      set(val) {
        this.$emit('update:value', val);
      },
    },
    /**
     *
     * @returns 搜索条件json
     */
    searchList(): IPageFilterElementDto[] {
      return !!this.json ? this.json : [];
    },
    /**
     * 直接显示的搜索条件
     */
    showSearchList() {
      const arr = this.searchList.filter((item: IPageFilterElementDto) => {
        return !item.isAdvanced && item.ifShow;
      });
      return arr.sort((a: IPageFilterElementDto, b: IPageFilterElementDto) => {
        return a.sortNum - b.sortNum;
      });
    },
    /**
     * 隐藏的搜索条件
     * 需开启高级过滤搜索
     */
    hiddenSearchList() {
      const arr = this.searchList.filter((item: IPageFilterElementDto) => {
        return item.isAdvanced && item.ifShow;
      });
      return arr.sort((a: IPageFilterElementDto, b: IPageFilterElementDto) => {
        return a.sortNum - b.sortNum;
      });
    },
    /**
     * 组件类型
     */
    componentType() {
      return (params: IPageFilterElementDto) => {
        return params.componentName;
      };
    },
    /**
     * 重新计算，提示文字
     */
    componentPlaceholder() {
      return (placeholder) => {
        if (isArray(placeholder)) {
          return placeholder.map((item) => {
            return this.l(item);
          });
        } else {
          return this.l(placeholder);
        }
      };
    },
  },
  mounted() {},
  methods: {
    /**
     * 获取查询数据
     */
    handleSearchClick() {
      (this.$refs.searchFromRef as any).validate().then((res: any) => {
        const arr = !this.hasAdvancedFilter ? this.showSearchList : this.searchList;
        const result = {};
        arr.forEach((item: IPageFilterElementDto) => {
          if (!item.field) return;
          if (item.skipValueIsNull && !res[item.field]) {
            return;
          } else if (!item.skipValueIsNull && !res[item.field]) {
            result[item.field] = null;
          } else {
            result[item.field] = res[item.field];
          }
        });
        this.$emit('search', result);
      });
    },
    /**
     * 值改变
     * 配合$on
     */
    handleChange(event, item: IPageFilterElementDto, val: any) {
      if (!item.field) return;
      if (item.skipValueIsNull && !val) {
        return;
      } else if (!item.skipValueIsNull && !val) {
        this.searchForm[item.field] = null;
      } else {
        this.searchForm[item.field] = val;
      }
      mittEvent.emit('formDataChange', {
        el: item,
        field: item.field,
        value: val,
      });
      this.$emit('change', {
        key: item.field,
        value: val,
      });
    },
    handleChangeAdvanceFilter() {
      this.hasAdvancedFilter = !this.hasAdvancedFilter;
    },
  },
});
